<template>
  <div class="app-container" :style="{ width: winProps.width, height: winProps.height}">
    <router-view></router-view>
  </div>
</template>

<script setup>

const winProps = reactive({
  width: '',
  height: '',
});

// 屏幕大小改变回调
const resize = () => {
  winProps.width = window.innerWidth + 'px';
  winProps.height = window.innerHeight + 'px';
};

onMounted(() => {
  resize();
});
</script>

<style scoped>
.app-container {
  box-sizing: border-box;
}
</style>